<template>
    <view v-if="isOfficialAccount" >
        <view class="official-account" >
            <view class="logo">
                <image :src="info.avatar"></image>
            </view>
            <view class="text">
                <view class="p">{{ info.name }}</view>
                <view class="p">关注公众号，享专属服务</view>
            </view>
            <view class="but" @click="isShow = true">立即关注</view>

        </view>
        <view v-if="isShow" style="width: 750rpx; height: 100vh; position:fixed;  overflow: hidden; z-index: 9999999999">
            <u-popup v-model="isShow" mode="center" border-radius="14" width="360" height="360" z-index="9999999999" style="z-index: 9999999999">
                <u-image width="350rpx" height="350rpx" :src="info.qrcode"></u-image>
            </u-popup>
        </view>
    </view>

</template>

<script>
import shLive from "./sh-live";

export default {
    name: "wxOfficialAccount",
    data(){
        return {
            isShow: false,
            isOfficialAccount: false,
			info: {}
        }
    },


    methods:{
		init() {
			let that = this;
			that.$http('common.weixinInfo').then(res => {
				if (res.code === 1) {
					that.info = res.data;
				}
			});
		},
    },

    created(){
        if( this.$platform.get() == 'wxOfficialAccount' ){
            this.isOfficialAccount = true
        }
		this.init();
    }

}
</script>

<style scoped>
    .official-account{
        width: 750rpx; height: 92rpx;
        background-color: rgba(0,0,0,.7);
        position: fixed;
        left: 0; bottom: 100rpx;
        padding: 15rpx 10rpx 10rpx 15rpx;
        box-sizing: border-box;
        display: flex;
    }
    .logo{
        width: 65rpx; height: 65rpx;
    }
    .logo image{
        width: 65rpx; height: 65rpx;
    }
    .text{
        width: 500rpx; height: 70rpx;
        margin-left: 20rpx;
    }
    .text .p{
        color: #fff;
        font-size: 24rpx;
    }
    .but{
        width: 140rpx; height: 50rpx;
        line-height: 50rpx;
        background-color: rgb(72,163,241);
        font-size: 25rpx;
        text-align: center;
        border-radius: 15rpx;
        color: #ffffff;
        margin-top: 10rpx;

    }
</style>